import 'package:flutter/material.dart';
import 'package:loxen/routes/routes.dart';
import 'package:loxen/viewmode/login_view_model.dart';
import 'package:loxen/viewmode/mine_page_viewmodel.dart';
import 'package:provider/provider.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:loxen/utils/string_res.dart';
import 'package:loxen/widget/my_subassembly.dart';

class MineSettingsWidget extends StatelessWidget {
  final ValueNotifier<bool> _isLogin = ValueNotifier(false);

  @override
  Widget build(BuildContext context) {
    _isLogin.value =
        !Provider.of<LoginViewModel>(context, listen: false).isLogin();
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: Size(double.infinity, 95.h),
        child: Container(
          color: Theme.of(context).backgroundColor,
          child: SafeArea(
            child: Column(
              children: <Widget>[
                Row(
                  children: <Widget>[
                    MySubassembly.getBackIcon(context,
                        color: Theme.of(context).textTheme.subtitle2.color),
                    Expanded(
                      child: Center(
                        child: Text(
                          StringResources.wo_de_she_zhi,
                          style: TextStyle(
                              fontSize: 32.sp,
                              fontWeight: FontWeight.w500,
                              color:
                                  Theme.of(context).textTheme.subtitle2.color),
                        ),
                      ),
                    ),
                    MySubassembly.getSearchIcon(null, text: Text('')),
                  ],
                )
              ],
            ),
          ),
        ),
      ),
      body: ListView(
        children: <Widget>[
          Container(
            color: Theme.of(context).backgroundColor,
            padding: const EdgeInsets.only(top: 26, left: 18.5),
            margin: const EdgeInsets.only(top: 3, bottom: 6.5),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                _isLogin.value
                    ? _renderMenuItem(context,
                        iconPath: 'images/privacy_policy.png',
                        text: StringResources.yin_si_ce_lue,
                        route: Routes.privacyPolicy,
                        needToken: false,
                        isLogin: _isLogin.value)
                    : SizedBox.shrink(),
                _isLogin.value
                    ? _renderMenuItem(context,
                        iconPath: 'images/mine_resetpwd.png',
                        text: StringResources.xiu_gai_mi_ma,
                        route: Routes.modifyPassword,
                        needToken: false,
                        isLogin: _isLogin.value)
                    : SizedBox.shrink(),
                _renderMenuItem(context,
                    iconPath: 'images/mine_opinion.png',
                    text: StringResources.yi_jian_fan_kui,
                    route: Routes.feedback,
                    needToken: false,
                    isLogin: _isLogin.value),
                _renderMenuItem(context,
                    iconPath: 'images/mine_about.png',
                    text: StringResources.guan_yu_wo_men,
                    route: Routes.aboutUs,
                    needToken: false,
                    isLogin: true),
                _renderMenuItem(context,
                    iconPath: 'images/mine_proto.png',
                    text: StringResources.fu_wu_xie_yi,
                    route: Routes.agreement,
                    needToken: false,
                    isLogin: true),
                _renderMenuItem(context,
                    iconPath: 'images/policy.png',
                    text: StringResources.yin_si_zheng_ce,
                    route: Routes.policy,
                    needToken: false,
                    isLogin: true),
              ],
            ),
          ),
          ValueListenableProvider.value(
            value: _isLogin,
            builder: (context, _) {
              if (context.watch<bool>()) {
                return Container(
                  color: Theme.of(context).backgroundColor,
                  padding: const EdgeInsets.only(left: 18.5),
                  margin: const EdgeInsets.only(bottom: 6.5),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      _renderMenuItem(context,
                          iconPath: 'images/mine_signout.png',
                          text: '退出登录',
                          loginOut: context.watch<bool>(),
                          isLogin: _isLogin.value),
                    ],
                  ),
                );
              } else {
                return SizedBox.shrink();
              }
            },
          )
        ],
      ),
    );
  }

  Widget _renderMenuItem(BuildContext context,
      {String iconPath,
      String text,
      bool hasRemind = false,
      String route,
      loginOut = false,
      needToken = true,
      bool isLogin,
      Function() onClick}) {
    return GestureDetector(
      onTap: () {
        if (route == null) {
          Provider.of<LoginViewModel>(context, listen: false).logout();
          Navigator.of(context).pop();
        } else {
          if (isLogin) {
            Navigator.of(context).pushNamed(route);
          } else {
            Navigator.of(context).pushNamed(Routes.login_page);
          }
        }
      },
      child: Container(
        padding: const EdgeInsets.only(top: 14, bottom: 14),
        decoration: BoxDecoration(
            border: Border(
          bottom: BorderSide(color: Colors.white, width: 0.5),
        )),
        child: Row(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Image.asset(
                  iconPath,
                  width: 50.w,
                  height: 50.w,
                  color: isLogin ? Color(0xFF000000) : Colors.black54,
                ),
                Container(
                  margin: const EdgeInsets.only(left: 14),
                  child: Text(
                    text,
                    style: TextStyle(
                      color: isLogin ? Color(0xFF000000) : Colors.black54,
                      fontSize: 28.sp,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
              ],
            ),
            Container(
              padding: EdgeInsets.only(right: 22.w),
              child: Row(
                children: <Widget>[
                  hasRemind
                      ? Container(
                          width: 7.5,
                          height: 7.5,
                          margin: const EdgeInsets.only(right: 16.5),
                          decoration: BoxDecoration(
                            color: Color(0xFF0CB7D9),
                            borderRadius: BorderRadius.circular(8),
                          ))
                      : SizedBox.shrink(),
                  Image.asset('images/mine_right.png', width: 15),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}
